<template>
  <div class="link flex">
    <table border="1" class="tabledata" v-if="date.isup">
      <tr>
        <td colspan="22" class="bg" style="font-size: 16px; font-weight: bold">
          日工程分析
        </td>
      </tr>
      <tr>
        <td colspan="22">
          <div style="white-space: pre-line;text-align: left;">
            <div v-for="item in inputs">
              <div v-if="item.label==uu||uu=='生产调度'||uu=='中润管理员'||uu=='系统管理员'">
                {{item.label}}:{{item.content?item.content:'无'}}
              </div>
            </div>
          </div>
        </td>
      </tr>
    </table>
    <div v-else style="width:100%;">
      <el-form :model="form" label-width="120px">
        <div style="width:100%;margin-top:20px;border-radius: 4px;boxShadow:var(--el-box-shadow-light);" v-for="item in inputs">
          <el-row  style="width:80%;padding-top:20px" v-if="item.label==uu||uu=='生产调度'||uu=='中润管理员'||uu=='系统管理员'">
              <el-col :span="24">
                  <el-form-item :label="item.label+'：'">
                      <el-input v-model="item.content" type="textarea" :rows="6"/>
                  </el-form-item>
              </el-col>
          </el-row>
        </div>
      </el-form>
    </div>
  </div>
</template>

<script lang="ts" setup name="rgcfx">
import cache from "@/utils/cache";
import { getRgcfx, rgcfxSave, rgcfxSubmit } from "@/api/report";

const uu = ref(cache.get('role_name'))
let arr = [
  {
    label:'备煤分厂',
    content:'',
    is:0,
  },{
    label:'炼焦分厂',
    content:'',
    is:0,
  },{
    label:'干熄焦分厂',
    content:'',
    is:0,
  },{
    label:'净化分厂',
    content:'',
    is:0,
  },{
    label:'动力分厂',
    content:'',
    is:0,
  },{
    label:'甲醇分厂',
    content:'',
    is:0,
  },{
    label:'精苯分厂',
    content:'',
    is:0,
  },{
    label:'质检中心',
    content:'',
    is:0,
  },{
    label:'销售部',
    content:'',
    is:0,
  },{
    label:'其它',
    content:'',
    is:0,
  },
]
const inputs = ref(arr)

const form = ref({})

const save = async () => {
  let userInfo = cache.get('userInfo')
  await rgcfxSave({
    label:uu.value,
    inputs:inputs.value,
    aid: userInfo.id,
    aname: userInfo.name,
    date:date.date,
  })
}
// 提交方法，调用接口
const submit = async () => {
  await rgcfxSubmit({
    label:uu.value,
    date:date.date,
  })
}

onMounted(() => {
  getData()
})

const getData = async () => {
  getRgcfx({
    label:uu.value,
    ...date,
  }).then((res)=>{
    if(res.length>0){
      inputs.value = res
    }else{
      inputs.value = arr
    }
    
    for(let i=0;i<inputs.value.length;i++){
      if(inputs.value[i].label==uu.value||uu.value=='生产调度'||uu.value=='中润管理员'||uu.value=='系统管理员'){
        inputs.value[i].is = 1
      }
    }
    
  })
}
const date = defineProps(['date','isup'])
watch(date, async (n) => {
  getData()
})

defineExpose({
  save,
  submit
})

</script>

<style lang="scss" scoped>
.tabledata {
  width: 100%;
  border: 1px solid #aaa;
  td {
    text-align: center;
    border: 1px solid #aaa;
    padding: 3px;
  }
  .bg{
    background: #ccc;
  }
}
</style>
